﻿ 
@{ 
    ViewBag.Title = "LOGIN"; 
}
@if (Model.meta.Success)
{
    Login login = (Login)Model.data;
    <style>
        .center {
            margin: auto;
            width: 60%;
            padding: 10px;
        }
        a {
            text-decoration: none;
        }
    </style>

    <div class="container panel" style="max-width: 500px;border-radius:10px; ">
        <div class="alert-warning mt-5 center" role="alert" style="border-radius:5px; ">
            <div class="panel-header">
                <h1 class="alert-heading text-center mt-3">
                    <a class="text-black-50"   href='@Url.Action("index","home")' title="Welcome" data-toggle="tooltip" style="text-decoration:none;">
                         Welcome
                    </a>
                </h1>
            </div>
            <div class="panel-body">
                <div class="p-3" style="max-width: 350px;">
                    <form asp-action="Login" asp-controller="Account"  asp-route-returnUrl="@ViewData["ReturnUrl"]" data-ajax="true" data-ajax-success="handleLogin" asp-ajax-onFailure="errLogin" data-ajax-method="POST"  class="form-horizontal" name="form_Login" id="form_Login">
                        <div class="form-group mb-4" title="UserName" data-toggle="tooltip">
                            <input asp-for="@login.UserName" id="UserName" data-val="true" class="form-control" type="text" placeholder="UserName" />
                            <span asp-validation-for="@login.UserName" class="text-danger"></span>
                        </div>

                        <div class="form-group mb-4" title="User Password" data-toggle="tooltip">
                            <input asp-for="@login.Password" id="Password" class="form-control" type="password" placeholder="User Password" autocomplete="on" />
                            <span asp-validation-for="@login.Password" class="text-danger"></span>
                        </div>

                        <div class="form-group mb-4">
                            <button type="submit" id="btnSubmit" class="btn btn-primary btn-block btn-flat"> Login </button>
                        </div>
                    </form>

                    <ul class="list-unstyled">
                        <li class="list-unstyled ist-group-horizontal">
                            <a class="text-black-50" href="@Url.Action("index", "home",new { returnUrl = ViewData["ReturnUrl"] })" style="text-decoration:none;"><i class="fas  fa-user" style="color:darkgray"></i> Return</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
}
else
{ 
    <partial name="ResponseModal" , for="@Model" />
}
 
<!--MD5-->
<script src="~/js/md5/md5.js"></script>
<script>
    var ReturnUrl = decodeURIComponent("@ViewData["ReturnUrl"]");

    function handleLogin(result) {
        
        layer.close(layer.index);
        if (result.meta.Success === false) {

            layer.open({
                title: 'Return'
                , content: result.meta.message + "-FAIL"
                , btn: 'OK'
            });
        }
        else
        {
            layer.msg(result.meta.message);
            if (!$.isEmptyObject(ReturnUrl)) {
                
                if (result.hasOwnProperty("data")) {
                    console.log(result.data);
                    setTimeout(function () { window.location.href = ReturnUrl; }, 1000);
                }
            } else {
                console.log("login seccess , return to home\index");
                setTimeout(function () { window.location.href = "@Url.Action("Index","Home")" }, 1000);
            }
        }
    }
    //onsubmit="return handleOnbegin()"
    function handleOnbegin() {
        
        //debugger;
        var password = $("#Password").val();

        if (password.lenght < 3) {
            layer.msg("User_Password_Format_TooShort");
            return false;
        }
         
        layer.msg("post...");

        return true;
    }
    function errLogin(data) {
        layer.close(layer.index);
        console.log(JSON.stringify(data));
        alert('ServerError' + "--client error");
        //layer.clear();
    }
</script>
